var webpack = require('webpack');
var path = require("path");
const htmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');//压缩css插件
const autoprefixer = require('autoprefixer')
module.exports = {
    entry: {
        index:'./src/index.js',
        ricebucket: './src/riceBucket.js',
    },
    output: {
        path:path.join(__dirname,'dist'),
        filename:'[name]-bundle.js'
    },
    watch: true,
    devServer:{
        host: "0.0.0.0",
        port:'8080',
        historyApiFallback: true,
        open:true,//自动拉起浏览器
        hot:true,//热加载
        inline: true, //实时刷新
        proxy: {
            '/classbuddy/': {
                target: 'https://120.55.27.24',
                changeOrigin: true,
                secure: false
            }
        },
        publicPath: "/"
    },
    plugins:[
        //热更新插件
        new webpack.HotModuleReplacementPlugin(),
        require('autoprefixer'),//自动添加css前缀
        new htmlWebpackPlugin({
            template:"index.html",
            filename:"index.html",
            hash: true,
            inject: true,
            chunks:['index'],
            minify: {
                removeComments: true,
                collapseWhitespace: true,
            },
            // necessary to consistently work with multiple chunks via CommonsChunkPlugin
            chunksSortMode: 'dependency'

        }),
        new htmlWebpackPlugin({
            template:"riceBucket.html",
            filename:"riceBucket.html",
            hash: true,
            inject: true,
            chunks:['ricebucket'],
            minify: {
                removeComments: true,
                collapseWhitespace: true,
            },
            // necessary to consistently work with multiple chunks via CommonsChunkPlugin
            chunksSortMode: 'dependency'

        }),

        new MiniCssExtractPlugin({
            filename: "[name].[contenthash].css",
            chunkFilename: "[name].[contenthash].css"
        }),
        new OptimizeCssAssetsPlugin()

    ],
    module: {
        rules: [{
            test: /\.js$/,
            use:['babel-loader'],
            exclude:/node_modules/
        },
        {
            test: /\.css$/,
            use: [ MiniCssExtractPlugin.loader, 'css-loader' ]
        },
        {
            test: /\.less$/,
            use:[ MiniCssExtractPlugin.loader,'css-loader','less-loader']
        },
         {
            test:/\.(jpg|jpeg|png|pneg|gif|bmp)$/,
            use: 'url-loader'}]
    },

};
